/*!
 * Copyright (C) 2010-2015 Kaj Magnus Lindberg (born 1979)
 *
 * This program is free software: you can redistribute it and/or modify
 * it under the terms of the GNU Affero General Public License as
 * published by the Free Software Foundation, either version 3 of the
 * License, or (at your option) any later version.
 *
 * This program is distributed in the hope that it will be useful,
 * but WITHOUT ANY WARRANTY; without even the implied warranty of
 * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
 * GNU Affero General Public License for more details.
 *
 * You should have received a copy of the GNU Affero General Public License
 * along with this program.  If not, see <http://www.gnu.org/licenses/>.
 */


.dw-depth-1 .dw-t
  padding-left: 0
  border-top: none

.DW.DW .dw-res
  margin: 0
  padding: 0 // if no CSS reset included
  line-height: normal // or PNG arrows and [-] offset incorrectly

.DW.DW .dw-res > li
  list-style-type: none

.dw-ar-p-hd,
// If vertical layout (rather than a 2D comments tree layout), restrict the width of
// all posts on the page.
.DW.dw-vt .dw-t,
// If horizontal 2D tree layout [2D_LAYOUT], only restrict the width of the root post.
.DW.dw-hz .dw-ar-t
  max-width: 830px
  width: 100%
// But 830px is a bit much for the orig post (except for on custom HTML pages = type 1 = .s_PT-1)
.esPage:not(.s_PT-1) .dw-p-bd-blk.esOrigPost
  max-width: 800px;
// iframes will probably automatically have their width set, by the embedding page. If the
// embedding page is a bit wide, better allow the iframe to be wider, too.
// wider,
.s_InIframe
  &.DW.dw-vt .dw-t,
  &.DW.dw-hz .dw-ar-t
    max-width: 1000px;


// But any main content width in custom html pages.
.DW.homepage .dw-ar-t
  max-width: none;

.DW .forum-title .dw-ar-t
  max-width: none;

.dw-t
  // SVG graphics is absolute positioned relative thread
  position: relative

.dw-depth-0.dw-t
  // Without this, SVG arrows are cropped a bit to the right. Why? [8DbF3]
  float: left
  clear: both

// Always show multi reply receivers (when replying to > 1 comment).
.dw-mrrs
  display: block !important



// Horizontal layout
//===========================


.dw-hz > .dw-single-and-multireplies
  display: table-row

.dw-hz > .dw-single-and-multireplies > .dw-res,
.dw-hz > .dw-single-and-multireplies > .dw-res > li
  display: table-cell;  // [4GKUF02]
  padding: 11px 0 10px 0;
  // Don't let the Reply form push other <li>s down, would offset PNG arrows incorrectly.
  vertical-align: top

// Make the column separator at least this high. But don't do this for
// .dw-fs because forms are folded/slided out, i.e. shrinked to zero height.
.DW.dw-hz .dw-depth-1:not(.dw-i-t)
  min-height: 100px


.DW.dw-hz
  color: black

  .dw-t.dw-depth-1
    // Avoids > 1 column with replies for this depth. However, width
    // adjusted by JS function d.i.layoutThreads() anyway.
    width: 450px
    // Space for the resize-column handle
    padding-right: 15px

  // Empty space between a post and its replies, where arrows are drawn.
  .dw-t-vspace
    height: 84px
    position: relative

  .dw-t.dw-hz > .dw-single-and-multireplies > .dw-res > li
    padding-left: 60px
    margin: 0

    &:first-child
      padding-left: 25px;

  .dw-t:not(.dw-hz) > .dw-single-and-multireplies > .dw-res > li
    margin: 0

    &:last-child
      padding-left: 0

  // -- skip this -- now I've added avatars and removed the post header background, which
  //   makes the line added below look terribly ugly.
  // Add an extra border above not-the-first sibling thread,
  // so it's easier to see where they start and end (since I don't
  // always indent).
  // But don't do this for the depth-1 threads since they're placed
  // in obvious columns anyway.
  /*
  .dw-t:not(.dw-depth-0) > .dw-single-and-multireplies > .dw-res > li:not(:first-child):not(:last-child)
    > .dw-t > .dw-p > .dw-p-hd,
    > .dw-p > .dw-p-hd
      border-top: 3px solid hsl(0, 0%, 70%)
  // -- /skip this --
    */

  // Max indentation depth
  //----------------------

  // Hide all vertical arrows (but show horizontal), show them later unless
  // too deeply indented.
  .dw-arw,
  .dw-arw-vt-handle
    display: none
  .dw-arw-hz-line-to-this,
  .dw-arw-hz-line-to-sibling,
  .dw-arw-hz-curve-to-this,
  .dw-arw-hz-branch-to-reply-btn, // TODO remove
  .dw-arw-hz-curve-to-reply-btn // TODO remove
    display: block;

  .dw-id0
    padding-left: 0 !important

  .dw-id0, .dw-id1, .dw-id2, .dw-id3, .dw-id4, .dw-id5
    padding-left: 35px

    > .dw-arw-vt-handle
    > .dw-arw:not(.dw-arw-vt-curve-to-this-first-unindented)
      display: block;

    > .dw-p .dw-rrs
      display: none;

  .dw-id6 + .dw-id5 > .dw-p .dw-rrs
    display: block;

  .dw-id6
    .dw-arw-vt-curve-to-this-first-unindented
      display: block

  // Don't indent multireplies
  .dw-depth-1 .dw-mr
    padding-left: 0


// Branch sideways
// -------------------

.dw-res .dw-t.dw-hz
  width: auto !important;
  max-width: none !important;
  > .dw-p,
  > .dw-p-as
    max-width: 500px;

.dw-res .dw-hz > .dw-single-and-multireplies > .dw-res > li > .dw-t .dw-p:not(.dw-zd)
  width: 410px !important;


// Resizable handle
// -------------------

// Draw dashed line between horizontal threads, on hower.
.DW.DW .dw-hz > .dw-single-and-multireplies > .dw-res > li > .dw-t > .resizable-r
  border-right: 1px dashed transparent

.DW.DW .dw-hz > .dw-single-and-multireplies > .dw-res > li:hover > .dw-t > .resizable-r
  border-right-color: lightgray

.DW .resizable-r
  width: 12px



// Vertical layout
//===========================

.DW.dw-vt

  // Avoid unnecessary indentation: Don't indent the last reply.
  // (We use arrowse instead to draw relationships.)
  // But do indent all replies to article replies, because article
  // replies are stacked on top of each other, so we need to
  // indent their replies.
  // (Previously, ended with li:last-child — then, the downmost reply was always  [6UWADTW0]
  // indented, even if some earlier siblings weren't. This made others (and me sometimes) confused.
  .dw-t:not(.dw-depth-1) > .dw-single-and-multireplies > .dw-res > li:only-child
    padding-left: 0

  .dw-t.dw-depth-0 > .dw-single-and-multireplies > .dw-res > li
    padding-left 0

  li:first-child .dw-depth-1  // but no border before the topmost reply
    border-top: none;
    padding-top: 0;
    margin-top: 0;

.dw-t:not(.dw-hz) > .dw-t-vspace
  display: none

// Don't indent multireplies
.dw-depth-2 .dw-mr
  padding-left: 0 !important

// Add thin lines between posts, in flat discussions.
// UX COULD use border-bottom instead, so will be a border between the last post,
// and the reply-to-original-post button — then eaiser to see that that reply btn,
// is not for the last post.
.DW .s_Ts-Flat > li:not(:first-child)
  border-top: 1px solid hsl(0, 0%, 92%);
  padding-top: 24px;
  margin-top: -15px;


// Max indentation depth
//---------------------------

.dw-depth-1,
.dw-id0
  padding-left: 0 !important;

.dw-res > li
  margin: 0

.dw-arw,
.dw-arw-vt-handle
  display: none

/* No max indentation depth would be:
@media (min-width: ????px)
  .DW.dw-vt
    .dw-res > li
      padding-left: 44px
    .dw-rrs,
    .dw-arw-vt-curve-to-this-first-unindented
      display: none
*/

@media (min-width: 940px)

  .DW.dw-vt

    // TODO check if this still works for id8 — I just changed from padding-left 35px to 41px.
    .dw-id0, .dw-id1, .dw-id2, .dw-id3, .dw-id4, .dw-id5, .dw-id6, .dw-id7, .dw-id8
      padding-left: 41px
      > .dw-arw-vt-handle
      > .dw-arw:not(.dw-arw-vt-curve-to-this-first-unindented)
        display: block;
      > .dw-p .dw-rrs
        display: none;

    .dw-id9 + .dw-id8 > .dw-p .dw-rrs
      display: block;

    .dw-id9
      .dw-arw-vt-curve-to-this-first-unindented
        display: block


@media (min-width: 500px) and (max-width: 939px)

  .DW.dw-vt

    .dw-id0, .dw-id1, .dw-id2, .dw-id3
      padding-left: 35px
      > .dw-arw-vt-handle
      > .dw-arw:not(.dw-arw-vt-curve-to-this-first-unindented)
        display: block;
      > .dw-p .dw-rrs
        display: none;

    .dw-id4 + .dw-id3 > .dw-p .dw-rrs
      display: block;

    .dw-id4
      .dw-arw-vt-curve-to-this-first-unindented
        display: block


@media (max-width: 499px)

  .DW.dw-vt

    .dw-id0, .dw-id1
      padding-left: 35px
      > .dw-arw-vt-handle
      > .dw-arw:not(.dw-arw-vt-curve-to-this-first-unindented)
        display: block;
      > .dw-p .dw-rrs
        display: none;

    .dw-id2 + .dw-id1 > .dw-p .dw-rrs
      display: block;

    .dw-id2
      .dw-arw-vt-curve-to-this-first-unindented
        display: block



// Folded threads
//===========================

.dw-zd.dw-t
  // instead of .dw-t's 8px, otherwise harder to understand
  // that it replies to the comment jus above.
  margin-top: 0px

.dw-zd.dw-2dcol
  // width: 40px !important;
  padding-right: 10px !important;

.dw-t.dw-zd .resizable-handle
  display: none;


// Closed threads
//===========================

.dw-t-closed > .dw-p
  margin-bottom: 30px
  padding-bottom: 33px

.dw-t-closed:not(.dw-depth-1) > .dw-p
  margin-bottom: 0px
  padding-bottom: 18px

.dw-t-closed > .dw-p > h3,
.dw-t-closed > .dw-p > h4
  margin: 0
  padding: 0



// vim: fdm=marker et ts=2 sw=2 tw=100 fo=tcqwn list
